<template>
	<view class="fs14">
		<view class="uni-flex justify-right w-full m-t10" v-if="!isShow && isButton">
			<view class="bg-blue text-white w-60n height-32 p-20 text-center m-r20 round-20" @click="isShow=true">筛选</view>
		</view>
		<view class="project-search bg-white p-t10" v-if="isShow">
			<view class="uni-flex justify-space-between m-b20">
				<view class="w-60n search-row-label">搜索</view>
				<uni-easyinput type="text" v-model="keyword" :placeholder="searchPlaceholder"></uni-easyinput>
			</view>
			<view class="uni-flex justify-space-between m-b20" v-if="isPID">
				<view class="w-60n search-row-label">阶段</view>
				<uni-data-select class="search-row-date" v-model="PID" :localdata="list"></uni-data-select>
			</view>
			<view class="uni-flex justify-space-between m-b20" v-if="isDate">
				<view class="w-60n search-row-label">日期</view>
				<uni-datetime-picker type="date" v-model="dateValue" />
			</view>
			
			<view class="uni-flex justify-space-around m-b20">
				<view class="w-40 bg-graydf text-gray9 justify-center align-center round-40 text-center" @click="cancelHandle">取消</view>
				<view class="w-40 bg-blue text-white justify-center align-center round-40 text-center" @click="clickHandle">确定</view>
			</view>
		</view>
	</view>
</template>

<script>
import { getModelProject } from "@/api/project.js";
export default {
	name: 'project-search',
	props: {
		isButton: {
			type: Boolean,
			default: true
		},
		showContent: {
			type: Boolean,
			default: false
		},
		date: {
			type: String,
			default: ""
		},
		searchPlaceholder: {
			type: String,
			default: "请输入"
		},
		isPID: {
			type: Boolean,
			default: true			
		},
		isDate: {
			type: Boolean,
			default: true			
		},
		PMType: {	//模板类
			type: String,
			default: '1'
		},
		Sub_dh: {	//工地唯一标识
			type: String,
			default: ''
		}
	},
	data(){
		return {
			isShow: false,
			dateValue: "",				//日期
			PID: "",				//阶段ID
			keyword: "",		//搜索内容
			list: [],		//阶段列表
			OType: 0
		}
	},
	watch:{
		showContent: function(newval, oldval){
			if(newval != oldval) this.isShow = newval;
		},
		PMType: function(newval, oldval){
			if(newval != oldval) this.OType = newval;
			this.getCrmList();
		}
	},
	mounted() {
		this.isShow = this.showContent;
		this.OType = this.PMType;
		this.dateValue = this.date;
		if(this.dateValue) {
			this.$emit('confirm', {PBegDate: this.dateValue});
		}else {
			this.$emit('confirm');			
		}
		if(this.isPID){
			this.getCrmList();
		}
	},
	methods:{
		cancelHandle(){
			this.isShow = false;
			this.$emit('cancel');
		},
		clickHandle(){
			this.isShow = false;
			let params = {
				PBegDate: this.dateValue,		//创建日期
				PID: this.PID,
				keyword: this.keyword
			};
			this.$emit('confirm', params);
		},
		/**
		 * 获取阶段列表
		 */
		getCrmList(){
			let that = this;
			getModelProject({
				OType: that.OType,
				Sub_dh: that.Sub_dh
			}).then((res) => {
				that.list = res.data.map((item,key) => { return {"value": item.ID, "text": item.PName}; });
			})
		}
	}
}
</script>

<style  lang="scss">
.project-search {
	width: 92vw;
	padding: 2vw 4vw;
	line-height: 70rpx;
}
.uni-row {
	margin-bottom: 20rpx !important;
}
.search-row-date {
	width: 100%;
	flex: 1;
}
</style>